<template>
  <div class="container" v-title data-title="阜阳欢乐行">
    <div class="suite" v-if="state">
      <div class="thumbImg">
        <img :src="require('./styles/asset/1_01.png')" />
      </div>
      <div class="coupon1">
        <div><img :src="require('./styles/asset/1_05.png')" /><a v-on:click="buySuite(productId[0])"></a></div>
      </div>
      <div class="coupon2">
        <div><img :src="require('./styles/asset/1_08.png')" /><a v-on:click="buySuite(productId[1])"></a></div>
        <div><img :src="require('./styles/asset/1_11.png')" /><a v-on:click="buySuite(productId[2])"></a></div>
      </div>
      <div class="thumbImg">
        <img :src="require('./styles/asset/1_04.png')" />
      </div>
      <!--<div class="thumb">
        <router-link :to="{ path: '/suite/suiteDetail', query: { productId: productId[0] }}" ><img :src="require('./styles/asset/d_03.jpg')" /></router-link>
      </div>
      <div class="thumb">
        <router-link :to="{ path: '/suite/suiteDetail', query: { productId: productId[1] }}"><img :src="require('./styles/asset/d_06.jpg')" /></router-link>
      </div>-->
    </div>
    <div class="suite"  v-else>

    </div>
    <simplert ref="simplert"></simplert>
  </div>
</template>

<script>
  import Simplert from '../components/dialog/dialog.vue'

  export default {
    data () {
      return {
        productId:['12','13','14'],
        token:"",
        state:true,
        postState:false,
        img: require('./styles/asset/share.jpg')
      }
    },
    created () {

    },
    mounted(){
      if(document.documentElement.clientWidth>750)
      {
        document.documentElement.style.fontSize = '100px'
      }else{
        document.documentElement.style.fontSize = document.documentElement.clientWidth / 7.5 + 'px';
      }
      const that = this;
      this.$util.getUserToken().then(token=>{
        that.token = token;
      })
      let root = process.env.MAIN_ROOT;
      this.$util.sendShareMessage("阜阳欢乐行","阜阳欢乐行，推出试运营套餐，让出行更轻松", root+this.img);
    },
    components: {
      Simplert

    },
    methods: {
      open (title, confirmBtn,customConfirmBtnText,onConfirm,type,onClose,message) {
        let obj = {
          title: title,
          useConfirmBtn: confirmBtn,
          customConfirmBtnText: customConfirmBtnText,
          onConfirm:onConfirm,
          type: type,
          onClose:onClose,
          message:message
        }
        this.$refs.simplert.openSimplert(obj)
      },
      buySuite(productId){
        let userAgentObj = navigator.userAgent;
        if(userAgentObj.match(/MicroMessenger/i))
        {
          //$(".weiChat").show();
          if(userAgentObj.match(/Android/i)){
            window.location.href = 'http://app.qq.com/#id=detail&appid=1106220919'
          }else if(userAgentObj.match(/iPhone/i)) {
            window.location.href = "xingjiakejiIOS:///#/activity/getcouponDaily";
            window.setTimeout(function(){
              window.location.href = "https://itunes.apple.com/cn/app/%E7%94%B5%E6%96%91%E9%A9%AC-%E8%AE%A9%E5%87%BA%E8%A1%8C%E6%9B%B4%E5%AE%89%E5%85%A8/id1252928655?mt=8";
            },2000)
          }else{
            window.location.href="http://download.xingjiakeji.com/";
          }
          return;
        }else{
          if(!this.token || this.token == undefined || this.token == ""){
            if(userAgentObj.match(/Android/i)){
              window.location.href = "xingjiakejiIOS:///#/activity/getcouponDaily";
            }
            window.setTimeout(function(){
              if(userAgentObj.match(/Android/i)){
                window.location.href = 'http://app.qq.com/#id=detail&appid=1106220919';
              }else if(userAgentObj.match(/iPhone/i)) {
                window.location.href = "https://itunes.apple.com/cn/app/%E7%94%B5%E6%96%91%E9%A9%AC-%E8%AE%A9%E5%87%BA%E8%A1%8C%E6%9B%B4%E5%AE%89%E5%85%A8/id1252928655?mt=8";
              }
            },2000)
            return;
          }
        }

        if(this.postState){
          return
        }else{
          this.postState = true;
        }
        const that = this;
        this.open('确认购买',true,'确认',function(){
          that.$api.post('/product/v1/authApi/buy?productId='+productId,{},s=>{
            that.postState = false;
            let userAgentObj = navigator.userAgent;
            that.open('购买成功',false,'','','fade_success',function(){
              if(userAgentObj.match(/Android/i)){
                window.control.refreshWallet();
              }else if(userAgentObj.match(/iPhone/i))
              {
                refreshWallet();
              }
              that.$router.go(-1)
            })
          },f=>{
            that.postState = false;
            if(f.resultCode == '30006')
            {
              that.open('余额不足请先充值！',true,'充值',function(){
                let userAgentObj = navigator.userAgent;
                if(userAgentObj.match(/Android/i)){
                  window.control.recharge();
                }else if(userAgentObj.match(/iPhone/i))
                {
                  recharge();
                }
              })
            }else if(f.errorMessage){
              that.open(f.errorMessage,false,'','','fade_alert',function(){

              });
            }else{
              that.open('购买失败',false,'','','fade_alert',function(){

              });
            }
          },{
            "token": that.token
          })
        },'',function(){
          that.postState = false;
        },"您是否确认购买此套餐？")
      },
    }
  }
</script>
<style scoped >
  @import "./styles/styles.css";
  .container{  width: 100%; height: 100%;}
  .suite{  margin: 0 auto; max-width: 750px; height: 100%; overflow-y: scroll;  background-color: rgba(95,193,239,1);}
  .thumbImg>img{ width: 100%;}
  .thumb{ padding-bottom:0.2rem;}
  .thumb>img{ width: 100%;}
  .coupon1 img,.coupon2 img{ width: 100%;}
  .coupon1>div{ position: relative;}
  .coupon2>div{ padding-top: 0.7rem; display: block; position: relative;}
  .coupon1>div>a,.coupon2>div>a{ position: absolute; width: 2rem; height: 1rem; right:0; bottom: 0.5rem;}
  .coupon1{ background: url('styles/asset/1_02.png') no-repeat; background-size: cover; padding: 5rem 0.8rem 0;}
  .coupon2{ background: url('styles/asset/1_03.png') no-repeat; background-size: contain; padding: 0 0.8rem 1rem;}
</style>
